<template>
  <div class="product-detail">
    <h2>Product Detail</h2>
  </div>
</template>

<script setup>
import { useRoute } from 'vue-router';
import { getproduct } from "@/apis/product";
import { ref, onMounted } from "vue";

const route = useRoute();
const product = ref({});
const id = route.params.id;

onMounted(async () => {
  const res = await getproduct(id);
  console.log(res);
  product.value = res.data;
});

</script>



<style scoped lang="scss">
.product-detail {
  padding: 20px;
  border: 1px solid #ccc;
  border-radius: 5px;
  margin-bottom: 20px;
}
</style>